/*
 * Ext JS Library 1.0 Beta 1
 * Copyright(c) 2006-2007, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://www.extjs.com/license
 */

Ext.onReady(function(){
    var ds = new Ext.data.Store({
       proxy: new Ext.data.HttpProxy({
            url: 'listadoProductos.do?listado=productos'
        }),
        reader: new Ext.data.XmlReader({
        	totalRecords: 'numRegistros',
			record: 'producto',
			id: 'id'
		}, ['id', 'nombre'])    
	});
	
    // Custom rendering Template
    var resultTpl = new Ext.Template(
        '<div class="search-item">',
            '<h3>{nombre}</h3>',
        '</div>'
    );
	
    var search = new Ext.form.ComboBox({
        store: ds,
        displayField:'nombre',
        valueField: 'id',
        typeAhead: false,
        loadingText: 'Buscando...',
        width: 300,
        pageSize:10,
        hideTrigger:true,
        tpl: resultTpl,
        queryParam : 'p1',
        onSelect: function(record){ // override default onSelect to do redirect
            inputHiddenIdProd.value=record.data.id;
            inputTextProducto.value=record.data.nombre;
            inputTextProducto.style.color=inputColor;
            this.collapse();
        },
        onEmptyResults: function(){
            inputTextProducto.style.color='#FF0000';
            inputHiddenIdProd.value = -1;
        	this.collapse();
        }
    });
    var inputTextProducto = document.getElementById(ac_inputTextName);
    var inputHiddenIdProd = document.getElementById(ac_inputHiddenName);
    var inputColor = inputTextProducto.style.color;
    // apply it to the exsting input element
    
    search.applyTo(ac_inputTextName);
});